<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <!--[if lt IE 9]>
    <script type="text/javascript" src="../../lib/html5shiv.js?rev=@@hash"></script>
    <script type="text/javascript" src="../../lib/respond.min.js?rev=@@hash"></script>
    <![endif]-->
    <link rel="stylesheet" type="text/css" href="../../static/h-ui/css/H-ui.min.css" />
    <link rel="stylesheet" type="text/css" href="../../static/h-ui.admin/css/H-ui.admin.css" />
    <link rel="stylesheet" type="text/css" href="../../lib/Hui-iconfont/1.0.8/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="../../static/h-ui.admin/skin/default/skin.css" id="skin" />
    <link rel="stylesheet" type="text/css" href="../../static/h-ui.admin/css/style.css" />
    <link rel="stylesheet" type="text/css" href="../../ht-css/Project.css" />
    <!--[if IE 6]>
    <script type="text/javascript" src="../../lib/DD_belatedPNG_0.0.8a-min.js" ></script>
    <script>DD_belatedPNG.fix('*');</script>
    <![endif]-->
    <link rel="stylesheet" type="text/css" href="../../ht-css/style-q.css" />
    <title>商品管理</title>
</head>
<body>
<nav class="breadcrumb">商品管理 <span class="c-gray en">&gt;</span> 商品售卖管理 <span class="c-gray en">&gt;</span> 库存明细<a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a></nav>
<article class="page-container">
 <form class="ml-20 mr-20" id="form-member-add"  method="post">   
        <div id="tab_topnav" class="HuiTab">
            <div class="tabBar clearfix"><span>商品售卖管理</span><span>商品图片管理</span></div>

            <!--库存明细-->
            <div class="tabCon pd-5 bg-1 bk-gray pb-10">
                <div class="lh-30 pd-10">
                    <div class="va-m lh-20 f-16 pb-15">
                        <strong>库存明细</strong>
                    </div>
                    <div class="line"></div>

                    <table class="table-hover table_li ml-10 mb-10 table">
                        <thead class="text-l">
                        <tr>
                            <td class="col-3-1">
                                <div class="row ml-10">
                                    <label class="form-label f-l pt-5">区域 ：</label>
                                     <div class="formControls col-xs-8 col-sm-9" style="width:70%">
                                            <input type="text" class="input-text radius" name="province"
                                                   placeholder="请选择省份" oninput="chaProvince()" id="province"
                                                   autocomplete="off">
                                             <ul class="relation radius guanlian" id="tuan">
                                             <li>无数据</li>
                                           </ul>
                                     </div>
                                </div>
                            </td>
                            <td class="col-3-1">
                                <div class="row ml-10">
                                    <label class="form-label f-l pt-5">市：</label>
                                    <div class="formControls col-xs-8 col-sm-9" style="width:70%">
                                            <input type="text" class="input-text radius" name="city"
                                                   placeholder="请选择城市" oninput="chaCity()" id="city" autocomplete="off">
                                           <ul class="relation radius guanlian" id="tuanCity">
                                            <li>无数据</li>
                                           </ul>
                                     </div>
                                </div>
                            </td>
                            <td class="col-3-1">
                                <div class="row ml-10">
                                    <label class="form-label f-l pt-5">仓名：</label>
                                    <div class="formControls col-xs-8 col-sm-9">
                                        <input type="text" class="input-text radius"  name="warehouse_name"  id="warehouse_name"  placeholder="仓名关键字">
                                    </div>
                                </div>
                            </td>
                        </tr>
                        </thead>
                    </table>
                    <div class="text-c mb-10">
                        <input id="bottm"  onclick="stock_search()" href="javascript:void(0);" type="button" class="btn btn-secondary radius size-S botter " value="&nbsp;查&nbsp;&nbsp;询&nbsp;">
                        <input name="" type="reset" class="btn radius size-S botter ml-10" value="&nbsp;重&nbsp;&nbsp;置&nbsp;">
                    </div>
                </div>
                <table class="table table-border table-bordered table-hover table-bg table-sort mt-10" id="datatable">
                    <thead>
                    <tr class="text-c">
                        <th width="50">地域</th>
                        <th width="50">仓名</th>
                        <th width="50">可用库存<i class="icon_up ml-5"></i></th>
                        <th width="50">占用库存<i class="icon_down ml-5"></i></th>
                        <th width="50">虚拟库存</th>
                    </tr>
                    </thead>
                    <tbody class="shun">
                    </tbody>
                </table>
            </div>
            <!--商品图片管理-->
            <div class="tabCon pd-5 bg-1 bk-gray pb-10">
                <div class="lh-30 pd-10">
                    <table class="table-hover table_li ml-10 mb-10 table">
                        <thead class="text-l">
                        <tr>
                            <td class="col-2-1">
                                <div class="row ml-10">
                                    <label class="form-label f-l pt-5">图片编码：</label>
                                    <div class="formControls col-xs-8 col-sm-9">
                                        <input type="text" class="input-text radius"  name="username"   placeholder="输入图片编码">
                                    </div>
                                </div>
                            </td>
                            <td class="col-2-1">
                                <div class="row ml-10">
                                    <label class="form-label f-l pt-5">图片名称：</label>
                                    <div class="formControls col-xs-8 col-sm-9">
                                        <input type="text" class="input-text radius"  name="username"   placeholder="输入图片名称关键字">
                                    </div>
                                </div>
                            </td>
                        </tr>
                        </thead>
                    </table>
                    <div class="text-c mb-10">
                        <input id="btn" type="submit" type="button" class="btn btn-secondary radius size-S botter " value="&nbsp;查&nbsp;&nbsp;询&nbsp;">
                        <input name="" type="reset" class="btn radius size-S botter ml-10" value="&nbsp;重&nbsp;&nbsp;置&nbsp;">
                    </div>
                    <div class="line"></div>
                    <table class="table">
                        <tbody>
                        <tr>
                            <td class="text-l va-t col-5-1"><img src="../../img/cn.gif"><img src=""><div class="lh-28 pt-10">编码： <span>TP001009</span></div><div class="lh-28">名称： <span>电缆横截面图电缆横截面图</span></div></td>
                            <td class="text-l va-t col-5-1"><img src="../../img/cn.gif"><div class="lh-28 pt-10">编码： <span>TP001009</span></div><div class="lh-28">名称： <span>电缆横截面图</span></div></td>
                            <td class="text-l va-t col-5-1"><img src="../../img/cn.gif"><div class="lh-28 pt-10">编码： <span>TP001009</span></div><div class="lh-28">名称： <span>电缆横截面图</span></div></td>
                            <td class="text-l va-t col-5-1"><img src="../../img/cn.gif"><div class="lh-28 pt-10">编码： <span>TP001009</span></div><div class="lh-28">名称： <span>电缆横截面图</span></div></td>
                            <td class="text-l va-t col-5-1"><img src="../../img/cn.gif"><div class="lh-28 pt-10">编码： <span>TP001009</span></div><div class="lh-28">名称： <span>电缆横截面图</span></div></td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </form>
</article>
<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="../../lib/jquery/1.9.1/jquery.min.js?rev=@@hash"></script>
<script type="text/javascript" src="../../lib/layer/2.4/layer.js?rev=@@hash"></script>
<script type="text/javascript" src="../../static/h-ui/js/H-ui.min.js?rev=@@hash"></script>
<script type="text/javascript" src="../../static/h-ui.admin/js/H-ui.admin.js?rev=@@hash"></script> <!--/_footer 作为公共模版分离出去-->
<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="../../lib/My97DatePicker/4.8/WdatePicker.js?rev=@@hash"></script>
<!--表单验证-->
<script type="text/javascript" src="../../lib/jquery.validation/1.14.0/jquery.validate.js?rev=@@hash"></script>
<script type="text/javascript" src="../../lib/jquery.validation/1.14.0/validate-methods.js?rev=@@hash"></script>
<script type="text/javascript" src="../../lib/jquery.validation/1.14.0/messages_zh.js?rev=@@hash"></script>
<script type="text/javascript" src="../../lib/datatables/1.10.0/jquery.dataTables.min.js?rev=@@hash"></script>
<script type="text/javascript" src="../../lib/laypage/1.2/laypage.js?rev=@@hash"></script>
<script src="../../ht-js/public.js?rev=@@hash"></script>
<!--验证token-->
<script src="../../ht-js/verifyToken.js?rev=@@hash"></script>
<script src="../../ht-js/Project.js?rev=@@hash"></script>
<script src="../../ht-js/goods/stock.js?rev=@@hash"></script>
<script>
    $(function(){
        $.Huitab("#tab_topnav .tabBar span","#tab_topnav .tabCon","current","click","0");
    });
    jQuery.Huitab =function(tabBar,tabCon,class_name,tabEvent,i){
        var $tab_menu=$(tabBar);
        // 初始化操作
        $tab_menu.removeClass(class_name);
        $(tabBar).eq(i).addClass(class_name);
        $(tabCon).hide();
        $(tabCon).eq(i).show();

        $tab_menu.bind(tabEvent,function(){
            $tab_menu.removeClass(class_name);
            $(this).addClass(class_name);
            var index=$tab_menu.index(this);
            $(tabCon).hide();
            $(tabCon).eq(index).show()})}

    //获取光标
    $("#province").focus(function () {
        $("#tuan").show()
    });
    $(document).bind("click", function (e) {
        //id为menu的是菜单，id为open的是打开菜单的按钮
        if ($(e.target).closest("#tuan").length == 0 && $(e.target).closest("#province").length == 0) {
            //点击id为menu之外且id不是不是open，则触发
            $("#tuan").hide()
        }
    })

    //区域下拉框
    function chaProvince() {
        var user_data = {
            area_name: $('#province').val(),
        }
        var succCallBack = function (data, status, response) {
            if (data.data != "") {
                var jsonObj = data.data;
                if (jsonObj == "") {
                    $("#tuan").html("<li>无数据</li> ");
                } else {
                    var optionstring = "";
                    for (var i = 0; i < jsonObj.length; i++) {
                        optionstring += "<li onclick='chaCity(\""+jsonObj[i].area_name +"\",\"" + jsonObj[i].area_id + "\")'>" + jsonObj[i].area_name + "</li>";
                    }
                    $("#tuan").html(optionstring);
                }
            } else {
                $("#tuan").html("<li>无数据</li> ");
            }
        }
        web.doAjax(root.goodsInter.goods_getArea, 'post',user_data, succCallBack);
    }
    //获取光标
    $("#city").focus(function () {
        $("#tuanCity").show()
    });
    $(document).bind("click", function (e) {
        //id为menu的是菜单，id为open的是打开菜单的按钮
        if ($(e.target).closest("#tuan").length == 0 && $(e.target).closest("#city").length == 0) {
            //点击id为menu之外且id不是不是open，则触发
            $("#tuanCity").hide()
        }
    })
    //市下拉框
    function chaCity(area_name,area_id) {
        $("#province").val(area_name);
        $("#tuan").hide();
        var user_data = {
            area_id: area_id
        }
        var succCallBack = function (data, status, response) {
            console.log(data.data)
            if (data.data != "") {
                var jsonObj = data.data;
                if (jsonObj == "") {
                    $("#tuanCity").html("<li>无数据</li> ");
                } else {
                    var optionstring = "";
                    for (var i = 0; i < jsonObj.length; i++) {
                        optionstring += "<li onclick='stock_cha(\""+jsonObj[i].name +"\",\""+ jsonObj[i].address_id + "\")'>" + jsonObj[i].name + "</li>";
                    }
                    $("#tuanCity").html(optionstring);
                }
            } else {
                $("#tuanCity").html("<li>无数据</li> ");
            }
        }
        web.doAjax(root.goodsInter.goods_getCityByArea, 'post', user_data,succCallBack);
    }
    var cityId;
    //查询
    function stock_cha(name,address_id){
        $("#city").val(name);
        cityId = address_id
    }

    //按钮查询
    function stock_search(){
        var sku_Id=getQueryString('sku_Id');
        $.ajax({
            type: "POST",
            url: root.goodsInter.goods_getStockDetail,
            cache: false,  //禁用缓存
            dataType: "json",
            data: {
                warehouse_name:  $("#warehouse_name").val(),
                sku_id:   sku_Id,
                cityId:  cityId,
            },  //传入组装的参数
            success: function (data) {
                stockList(data);
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert(XMLHttpRequest);
            }
        });
    }
</script>
</body>
</html>